Skip to content

fix: handle touch device submenu interactions #5818

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

fix: handle touch device submenu interactions #5818

wants to merge 6 commits into from
+54 −55

Conversation

@shipg22
Copy link

@shipg22 shipg22 commented Oct 21, 2025 •
edited
Loading

Description

https://opensource.adobe.com/spectrum-web-components/storybook/index.html?path=/story/menu-submenu--submenu

Submenu interaction is fixed for touch devices.

Submenu should open on hover for desktop and on click for touch devices.
First click should open, and second click should close the submenu on touch devices.

Motivation and context

Related issue(s)

[CCEX-244009]

  • fixes [Issue Number]

Screenshots (if appropriate)

Author's checklist

  • I have read the CONTRIBUTING and PULL_REQUESTS documents.
  • I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
  • I have added automated tests to cover my changes.
  • I have included a well-written changeset if my change needs to be published.
  • I have included updated documentation if my change required it.

Reviewer's checklist

  • Includes a Github Issue with appropriate flag or Jira ticket number without a link
  • Includes thoughtfully written changeset if changes suggested include patch, minor, or major features
  • Automated tests cover all use cases and follow best practices for writing
  • Validated on all supported browsers
  • All VRTs are approved before the author can update Golden Hash

Manual review test cases

https://opensource.adobe.com/spectrum-web-components/storybook/index.html?path=/story/menu-submenu--submenu

First click should open, and second click should close the submenu on touch devices.

Device review

  • Did it pass in Desktop?
  • Did it pass in (emulated) Mobile?
  • Did it pass in (emulated) iPad?

@shipg22 shipg22 requested a review from a team as a code owner October 21, 2025 22:36
@changeset-bot
Copy link

changeset-bot bot commented Oct 21, 2025 •
edited
Loading

🦋 Changeset detected

Latest commit: 3d86d63

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 84 packages
Name Type
@spectrum-web-components/menu Patch
@spectrum-web-components/breadcrumbs Patch
@spectrum-web-components/combobox Patch
@spectrum-web-components/picker Patch
@spectrum-web-components/custom-vars-viewer Patch
example-project-rollup Patch
example-project-webpack Patch
@spectrum-web-components/story-decorator Patch
@spectrum-web-components/bundle Patch
@spectrum-web-components/action-menu Patch
documentation Patch
@spectrum-web-components/eslint-plugin Patch
@spectrum-web-components/accordion Patch
@spectrum-web-components/action-bar Patch
@spectrum-web-components/action-button Patch
@spectrum-web-components/action-group Patch
@spectrum-web-components/alert-banner Patch
@spectrum-web-components/alert-dialog Patch
@spectrum-web-components/asset Patch
@spectrum-web-components/avatar Patch
@spectrum-web-components/badge Patch
@spectrum-web-components/button-group Patch
@spectrum-web-components/button Patch
@spectrum-web-components/card Patch
@spectrum-web-components/checkbox Patch
@spectrum-web-components/clear-button Patch
@spectrum-web-components/close-button Patch
@spectrum-web-components/coachmark Patch
@spectrum-web-components/color-area Patch
@spectrum-web-components/color-field Patch
@spectrum-web-components/color-handle Patch
@spectrum-web-components/color-loupe Patch
@spectrum-web-components/color-slider Patch
@spectrum-web-components/color-wheel Patch
@spectrum-web-components/contextual-help Patch
@spectrum-web-components/dialog Patch
@spectrum-web-components/divider Patch
@spectrum-web-components/dropzone Patch
@spectrum-web-components/field-group Patch
@spectrum-web-components/field-label Patch
@spectrum-web-components/help-text Patch
@spectrum-web-components/icon Patch
@spectrum-web-components/icons-ui Patch
@spectrum-web-components/icons-workflow Patch
@spectrum-web-components/icons Patch
@spectrum-web-components/iconset Patch
@spectrum-web-components/illustrated-message Patch
@spectrum-web-components/infield-button Patch
@spectrum-web-components/link Patch
@spectrum-web-components/meter Patch
@spectrum-web-components/modal Patch
@spectrum-web-components/number-field Patch
@spectrum-web-components/overlay Patch
@spectrum-web-components/picker-button Patch
@spectrum-web-components/popover Patch
@spectrum-web-components/progress-bar Patch
@spectrum-web-components/progress-circle Patch
@spectrum-web-components/radio Patch
@spectrum-web-components/search Patch
@spectrum-web-components/sidenav Patch
@spectrum-web-components/slider Patch
@spectrum-web-components/split-view Patch
@spectrum-web-components/status-light Patch
@spectrum-web-components/swatch Patch
@spectrum-web-components/switch Patch
@spectrum-web-components/table Patch
@spectrum-web-components/tabs Patch
@spectrum-web-components/tags Patch
@spectrum-web-components/textfield Patch
@spectrum-web-components/thumbnail Patch
@spectrum-web-components/toast Patch
@spectrum-web-components/tooltip Patch
@spectrum-web-components/top-nav Patch
@spectrum-web-components/tray Patch
@spectrum-web-components/underlay Patch
@spectrum-web-components/vrt-compare Patch
@spectrum-web-components/base Patch
@spectrum-web-components/grid Patch
@spectrum-web-components/opacity-checkerboard Patch
@spectrum-web-components/reactive-controllers Patch
@spectrum-web-components/shared Patch
@spectrum-web-components/styles Patch
@spectrum-web-components/theme Patch
@spectrum-web-components/truncated Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@coveralls
Copy link
Collaborator

coveralls commented Oct 22, 2025 •
edited
Loading

Pull Request Test Coverage Report for Build 18848854066

Details

  • 30 of 46 (65.22%) changed or added relevant lines in 1 file are covered.
  • 1 unchanged line in 1 file lost coverage.
  • Overall coverage decreased (-0.002%) to 97.964%
Changes Missing Coverage Covered Lines Changed/Added Lines %
packages/menu/src/MenuItem.ts 30 46 65.22%
Files with Coverage Reduction New Missed Lines %
packages/menu/src/MenuItem.ts 1 94.13%
Totals Coverage Status
Change from base Build 18844771637: -0.002%
Covered Lines: 34253
Relevant Lines: 34782
💛 - Coveralls

@shipg22 shipg22 force-pushed the shiprag/fix-touch-submenu-interactions branch from 5d2c58a to 8b7aa06 Compare October 22, 2025 17:14
@Rajdeepc
Copy link
Contributor

Rajdeepc commented Oct 23, 2025 •
edited
Loading

Hi @shipg22 Good start! Can you create a couple of manual test cases on the PR description for other reviewers to test this change in various devices and do some sanity check for any regressions.

@Rajdeepc Rajdeepc added Status: WIP PR is a work in progress or draft Contribution PRs from contributors labels Oct 23, 2025
@shipg22 shipg22 closed this Oct 23, 2025
@shipg22 shipg22 reopened this Oct 23, 2025
@shipg22 shipg22 closed this Oct 23, 2025
@shipg22 shipg22 reopened this Oct 23, 2025
@shipg22 shipg22 closed this Oct 24, 2025
@shipg22 shipg22 reopened this Oct 24, 2025
@shipg22 shipg22 closed this Oct 24, 2025
@shipg22 shipg22 reopened this Oct 24, 2025
@shipg22
Copy link
Author

shipg22 commented Oct 24, 2025

Hi @shipg22 Good start! Can you create a couple of manual test cases on the PR description for other reviewers to test this change in various devices and do some sanity check for any regressions.

Done, thanks!

@shipg22 shipg22 closed this Oct 27, 2025
@shipg22 shipg22 reopened this Oct 27, 2025
@shipg22 shipg22 force-pushed the shiprag/fix-touch-submenu-interactions branch from 7af7f97 to d9a1f48 Compare October 30, 2025 05:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

Contribution PRs from contributors Status: WIP PR is a work in progress or draft

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@shipg22 @coveralls @Rajdeepc